<%@taglib prefix="c" uri="http://java.sun.com/jstl/core_rt"%>
<script type="text/javascript">
	$(document).ready(function() {
		$("#listView").tablesorter({
			widgets : [ 'zebra' ],
			headers : {
				0 : {
					sorter : false
				}
			}
		}).tablesorterPager({
			container : $("#pager")
		});
	});

	function checkAll(name, status) {
		$("input[@name=" + name + "][type='checkbox']").each(function() {
			$(this).attr("checked", status);
		});
	}

	function uncheckMaster(id, checked) {
		if (!checked) {
			$("input[id=" + id + "][type='checkbox']").attr("checked", false);
		}
	}

	function editView() {
		window.location.href = "edit.htm";
	}

	function deleteSelectedView(name) {

		var hasCheckFlag = false;
		$("input[@name=" + name + "][type='checkbox'][checked]").each(
				function() {
					hasCheckFlag = true;
				});

		if (hasCheckFlag) {
			if (confirm("Are you sure you want to delete these selected customers?")) {
				document.custList.submit();
			}
		} else {
			alert("Please select customers to delete")
		}

	}
</script>
<table class="toolBar">
	<tr>
		<td align="left">
		<input type="button" value="New Customer" onclick="editView()" /> 
		<input type="button" value="Delete" onclick="deleteSelectedView('custIds')" /> 
		<!--<input type="text" name="cust_search"/> <input type="button" value="Search" />-->
		</td>
		<td align="right">
		<a href="#"><img src="/lb7/media/ico_file_excel.png" />Export Excel</a> 
		<a href="#"><img src="/lb7/media/ico_file_pdf.png" />Export PDF</a>
		</td>
	</tr>
</table>
<form name="custList" action="deleteSelected.htm" method="post">
	<table id="listView" class="tablesorter">
		<thead>
			<tr>
				<th><input type="checkbox" id="selectAll"
					onclick="checkAll('custIds', this.checked)" /></th>
				<th>Customer Name</th>
				<th>Contact Person</th>
				<th>Landline</th>
				<th>Mobile</th>
				<th>Address</th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${customerList}" var="cust">
				<tr>
					<td><input type="checkbox" name="custIds"
						value="${cust.customerId}"
						onclick="uncheckMaster('selectAll', this.checked)" /></td>
					<td><a href="view.htm?custId=${cust.customerId}">${cust.customerName}</a>
					</td>
					<td>${cust.contactPerson.lastName},
						${cust.contactPerson.firstName}</td>
					<td>${cust.phone}</td>
					<td>${cust.mobile}</td>
					<td>${cust.residentAddress.city},
						${cust.residentAddress.province}</td>
				</tr>
			</c:forEach>
		</tbody>
	</table>
</form>
<br />
<div id="pager" class="pager">
	<form>
		<img src="/lb7/media/first.png" class="first" /> <img
			src="/lb7/media/prev.png" class="prev" /> <input type="text"
			class="pagedisplay" /> <img src="/lb7/media/next.png" class="next" />
		<img src="/lb7/media/last.png" class="last" /> <select
			class="pagesize">
			<option selected="selected" value="10">10</option>
			<option value="20">20</option>
			<option value="50">50</option>
		</select>
	</form>
</div>
<br />
